import React from 'react';
import { Spin, message } from 'antd';
import CodeMirror from '@uiw/react-codemirror';
import { cpp } from '@codemirror/lang-cpp';
import { java } from '@codemirror/lang-java';
import { python } from '@codemirror/lang-python';
import { submissionService } from '@/services/submissionService';
import styles from './SubmissionDetail.module.css';

interface SubmissionDetailProps {
  submissionId: string;
  language: string;
}

const getLanguageExtension = (language: string) => {
  switch (language) {
    case 'C':
    case 'C++':
      return cpp();
    case 'Java':
      return java();
    case 'Python3':
      return python();
    default:
      return cpp();
  }
};

const SubmissionDetail: React.FC<SubmissionDetailProps> = ({
  submissionId,
  language,
}) => {
  const [loading, setLoading] = React.useState(false);
  const [code, setCode] = React.useState('');

  React.useEffect(() => {
    fetchDetail();
  }, [submissionId]);

  const fetchDetail = async () => {
    try {
      setLoading(true);
      const response = await submissionService.getSubmissionDetail(submissionId);
      setCode(response.data.data.code);
    } catch (error) {
      message.error('获取提交详情失败');
    } finally {
      setLoading(false);
    }
  };

  return (
    <div className={styles.detail}>
      <Spin spinning={loading}>
        <CodeMirror
          value={code}
          height="200px"
          theme="light"
          editable={false}
          extensions={[getLanguageExtension(language)]}
        />
      </Spin>
    </div>
  );
};

export default SubmissionDetail; 